<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>步进器</title>
  </head>
  <style>
    #less,
    #add {
      width: 100px;
      height: 100px;
      background: red;
    }
    #num {
      font-size: 60px;
    }
  </style>
  <body>
    <div style="display: flex;">
      <div id="less" onclick="changeNum(false)"></div>
      <div
        style="width: 100px;height: 100px;display: flex;align-items: center;"
      >
        <p id="num">0</p>
      </div>
      <div id="add" onclick="changeNum(true)"></div>
    </div>
  </body>
  <script>
    let num = document.querySelector("#num"); //获取dom节点
    //获取当前数量
    function getNum() {
      return Number(num.innerHTML);
    }
    //页面回显
    function updateNum({ quantity }) {
      num.innerHTML = quantity;
    }
    // //减号
    // function less(){
    //     let quantity = this.getNum() - 1;
    //     this.updateNum({quantity});
    // }
    // //加号
    // function add(){
    //     let quantity = this.getNum() + 1;
    //     this.updateNum({quantity});
    // }
    //加减号
    function changeNum(flag) {
      let tmpNum = flag ? 1 : -1;
      let quantity = this.getNum() + tmpNum;
      this.updateNum({ quantity });
    }

    function Person() {
      //构造函数
      this.name = "小米";
      this.color = "黄色";
      this.eat = function() {
        console.log("吃东西");
      };
    }
    Person.prototype.gender = "男";
    Person.prototype.say = function() {
      console.log("说话");
    };
    var man = new Person();
    man.eat();
    man.say();

    // 原型链关系:原型链的形成是真正是靠__proto__
    // 构造函数有属性:prototype  ,对象有隐式属性:__proto__ ,js中一切又都是对象
    //console.log(man.constructor) //查看对象的构造函数
    // console.log(Person.prototype == man.__proto__) //true
    // console.log(Person.prototype.__proto__ == Object.prototype) //true
    console.log(Object.prototype);
    console.log(Object.prototype.__proto__); //true
  </script>
</html>
